<template>
  <div id="newCenter">
    <router-view></router-view>
    <van-list
      v-model="loading"
      :finished="finished"
      finished-text="没有更多了"
      @load="onLoad"
    >
      <van-cell >
        <NewsListItem :new_item="item" :isLastItem="i == (list.length - 1)" v-for="(item,i) in list" type="news"></NewsListItem>
      </van-cell>
    </van-list>
  </div>
</template>

<script>
import NewsListItem from "./NewsListItem";
import { api_newsListWithPage } from "./../../../../service/api/home";
import { actionWithLink } from "./../../../../utils/utils";

export default {
  name: "NewCenter",
  data() {
    return {
      currentPage: 0,
      list: [],
      loading: false,
      finished: false
    };
  },
  components: {
    NewsListItem
  },
  methods: {
    onLoad() {
      api_newsListWithPage(this.currentPage)
        .then(res => {
          console.log(res);

          // this.list = res.data.records;

          this.loading = false;

          if (res.data.pages <= this.currentPage) {
            this.finished = true;
          } else {
            this.currentPage += 1;
          }

          var dataList = res.data.records;
          for (var i = 0; i < dataList.length; i++) {
            this.list.push(dataList[i]);
          }
        })
        .catch(error => {
          console.log(error);
        });
    }
  }
};
</script>

<style scoped>
#newCenter {
  /*width: 100%;*/
  /*height: 100%;*/

  /*position: absolute;*/

  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  /*height: 100%;*/
  background-color: #f5f5f5;
  z-index: 200;
  overflow: auto;
}

#newCenter >>> .van-cell:not(:last-child)::after {

  border-bottom: 0px solid #ebedf0;
}
</style>
